<template>
  <div class="pre-area">
    <pre v-html="data" />
    <footer>
      <el-button @click="copy" type="primary" size="small">复制代码</el-button>
    </footer>
  </div>
</template>

<script>
import { defineComponent, watch, computed, ref } from "vue";

export default defineComponent({
  name: "ErrorReturnExample",
  props: {
    data: {
      type: String,
      default: "",
    },
  },
  setup(props, { emit }) {
    const copy = () => {
      let oInput = document.createElement("input");
      oInput.value = url;
      document.body.appendChild(oInput);
      oInput.select(); // 选择对象;
      console.log(oInput.value);
      document.execCommand("Copy"); // 执行浏览器复制命令
      ElMessage.success("复制成功");
      oInput.remove();
    };
    return {
      copy,
    };
  },
});
</script>

<style lang="scss" scoped>
.pre-area {
  border-radius: 2px;
  border: 1px solid #dbdee6;
  pre {
    min-height: 200px;
  }
  footer {
    text-align: right;
    padding:10px;
  }
}
</style>
